import React from 'react';
import { Input } from 'antd';
import { isFunction } from '../../../utils/is-object';

export default function createInput(options = {}) {
  const {
    property,
    data = {},
    size = 'small',
    onChange,
    onEnter,
    getter = (data, property) => data[property],
    getValue = value => value,
    onFocuser,
  } = options;
  const onChangeHandler = event => {
    let { value } = event.target;
    if (isFunction(getValue)) {
      value = getValue(value);
    }
    if (isFunction(onChange)) {
      onChange(value, property);
    }
  };
  const onPressEnter = event => {
    let { value } = event.target;
    if (isFunction(getValue)) {
      value = getValue(value);
    }
    if (isFunction(onEnter)) {
      onEnter(value, property);
    }
  };

  const onFocus = () => {
    if(isFunction(onFocuser)) {
      onFocuser(value, property);
    }
  };

  const value = getter(data, property);
  return (
    <Input
      value={value}
      size={size}
      onPressEnter={onPressEnter}
      onChange={onChangeHandler}
      onBlur={onPressEnter}
      onFocus={onFocus}
    />
  );
}
